<template>
  <div>
    <a-divider style="font-weight: 700;" orientation="left">新增线索</a-divider>
    <a-form ref="formRef" :model="formWhole" :labelCol="{ style: { width: '120px' } }"
      :wrapperCol="{ span: 7, offset: 0 }" :rules="{ ThreadName: [{ required: true, message: '线索名称是必填项' }] }">
      <a-form-item ref="ThreadName" label="线索名称" name="ThreadName">
        <a-input v-model:value="formWhole.ThreadName" />
      </a-form-item>
      <a-form-item ref="Linkman" label="联系人" name="Linkman">
        <a-input v-model:value="formWhole.Linkman" />
      </a-form-item>
      <a-form-item ref="phone" label="联系手机" name="phone">
        <a-input v-model:value="formWhole.phone" />
      </a-form-item>
      <a-form-item ref="RelationWeChat" label="联系微信" name="RelationWeChat">
        <a-input v-model:value="formWhole.RelationWeChat" />
      </a-form-item>
      <a-form-item label="公司规格" name="CompanySpecification">
        <a-select placeholder="请选择" v-model:value="formWhole.CompanySpecification">
          <a-select-option value="20人以下">20人以下</a-select-option>
          <a-select-option value="20-99人">20-99人</a-select-option>
          <a-select-option value="100-499人">100-499人</a-select-option>
          <a-select-option value="500-999人">500-999人</a-select-option>
          <a-select-option value="1000-9999人">1000-9999人</a-select-option>
          <a-select-option value="10000人以上">10000人以上</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="所属行业" name="Customer">
        <a-select placeholder="请选择" v-model:value="formWhole.Customer">
          <a-select-option value="计算机软件/硬件">计算机软件/硬件</a-select-option>
          <a-select-option value="计算机系统/维修">计算机系统/维修</a-select-option>
          <a-select-option value="通信(设备/运营/服务)">通信(设备/运营/服务)</a-select-option>
          <a-select-option value="互联网/电子商务">互联网/电子商务</a-select-option>
          <a-select-option value="网络游戏">网络游戏</a-select-option>
          <a-select-option value="电子/半导体/集成电路">电子/半导体/集成电路</a-select-option>
          <a-select-option value="仪器仪表/工业自动化">仪器仪表/工业自动化</a-select-option>
          <a-select-option value="会计/审计">会计/审计</a-select-option>
          <a-select-option value="金融(投资/证券)">金融(投资/证券)</a-select-option>
          <a-select-option value="金融(银行/保险)">金融(银行/保险)</a-select-option>
        </a-select>
      </a-form-item>
      <a-form-item label="所在地区" name="PlaceArea">
        <al-cascader placeholder="请选择所在地区" :value="formWhole.PlaceArea" @input="(e: any) => formWhole.PlaceArea = e"
          level="3" data-type="all" />
      </a-form-item>
      <a-form-item ref="Datailed" label="详细地址" name="Datailed">
        <a-input v-model:value="formWhole.Detailed" />
      </a-form-item>
      <a-form-item label="备注" name="Remark">
        <a-textarea :rows="4" v-model:value="formWhole.Remark" />
      </a-form-item>
      <a-form-item label="所属销售">
        <a-radio-group v-model:value="formWhole.WhatMarket">
          <a-radio value="1">我的线索</a-radio>
          <a-radio value="0">公共线索</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item :wrapper-col="{ span: 5, offset: 3 }">
        <a-button style="width: 110px;" type="primary" @click="onSubmit">立即创建</a-button>
      </a-form-item>
    </a-form>
  </div>
</template>

<script setup lang="ts">
import { ref } from "vue";
import AlCascader from "@/components/AlCascader/al-cascader.vue"
import request from "@/request";
import { message } from "ant-design-vue";
import storage from 'store'
import { useRouter } from "vue-router";
const router = useRouter()
const formWhole = ref({
  ThreadName: "", //线索名称
  Linkman: "", // 联系人
  phone: null, // 联系电话
  RelationWeChat: "", // 联系微信
  Customer: undefined, // 客户行业
  PlaceArea: [], // 所在地区
  Detailed: "", // 详细地址
  CompanySpecification: undefined, // 公司规格
  Creator: storage.get('_id'), // 创建人
  Remark: "", // 备注
  WhatMarket: "1", // 所属销售
});
const formRef = ref()
const onSubmit = () => {
  formRef.value.validate().then((e: any) => {
    request.post('clue', formWhole.value).then(({ data }) => {
      message.success('创建成功!')
      router.back()
    })
  }).catch(() => { })
};

</script>

<style>

</style>